<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>{$config_sitename}</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="__CSS__/userpp.css?t={$ver}" rel="stylesheet">
</head>
<body class="body-pad cl-b-lgrey per-info-wrapper nofoot">
	<div class="ub ub-ac page-header">
		<a href="javascript:history.back();" class="clickable"><span class="icon-back"></span></a>
		<div class="ub-f1 page-name">个人资料</div>
		<a href="javascript:;" class="clickable write-mail ub">
			<span class="ub-con cl-f-lorange user-sendbtn" data-type="yes">保存</span>
		</a>
	</div>
	<form class="ub ub-ver per-info-list user-form" data-url="{:U('User/person')}">
		<div class="ub-f1 cl-b-white per-info-item">
			<p class="ub ub-ac cl-f-xxlgrey">
				<span class="per-l cl-f-black">昵称</span>
				<input type="text" name="nickname" class="per-input ub-f1" value="{$info.nickname}" placeholder="请输入昵称">
			</p>
			<p class="ub ub-ac cl-f-xxlgrey">
				<span class="per-l cl-f-black">性别</span>
				<input type="radio" id="boy" name="usex" value="1" <eq name="info.usex" value="1">checked</eq> ><label for="boy">男</label>
				<input type="radio" id="girl" name="usex" value="2" <eq name="info.usex" value="2">checked</eq> ><label for="girl">女</label>
				<input type="radio" id="bg" name="usex" value="3" <eq name="info.usex" value="">checked</eq> ><label for="bg">未知</label>
			</p>
			<p class="ub ub-ac cl-f-xxlgrey">
				<span class="per-l cl-f-black">邮箱</span>
				<input type="text" class="per-input ub-f1" name="uemail" value="{$info.uemail}" placeholder="请输入邮箱">
			</p>
		</div>
		<div class="ub-f1 cl-b-white per-info-item per-info-add">
			<p class="ub ub-ac cl-f-xxlgrey">
				<span class="per-l cl-f-black">省市</span>
				<select name="uprovince" id="province" onchange="loadRegion('province','city','{:U('User/getcity')}');">
					<option value="0" selected>省份/直辖市</option>
                    <volist name="province" id="vo">
                        <option value="{$vo.province_id}" <eq name="info.uprovince" value="$vo['province_id']"> selected</eq> >{$vo.province_name}</option>
                    </volist>
				</select>
				<select name="ucity" id="city"  onchange="loadRegion('city','area','{:U('User/getarea')}');">
					<if condition="$info.ucity neq 0 && $info.ucity neq ''">
                        <foreach name="ucity" item="uc">
                            <option value="{$uc.city_id}" <eq name="info.ucity" value="$uc['city_id']"> selected</eq>>{$uc.city_name}</option>
                        </foreach>
                    <else/>
                        <option value="0">市/县</option>
                    </if>
				</select>
				<select name="uarea" id="area">
					<if condition="$info.uarea neq 0 && $info.uarea neq ''">
                        <foreach name="uarea" item="ua">
                            <option value="{$ua.area_id}" <eq name="info.uarea" value="$ua['area_id']"> selected</eq>>{$ua.area_name}</option>
                        </foreach>
                        <else/>
                        <option value="0">镇/区</option>
                    </if>
				</select>
			</p>
			<p class="ub ub-ac cl-f-xxlgrey">
				<span class="per-l cl-f-black">手机</span>
				<input type="text" class="per-input ub-f1" name="umobile" value="{$info.umobile}" placeholder="请输入手机号">
			</p>
			<p class="ub ub-ac cl-f-xxlgrey">
				<span class="per-l cl-f-black">地址</span>
				<input type="text" class="per-input ub-f1" name="uadd" value="{$info.uadd}" placeholder="请输入地址">
			</p>
		</div>
		<div class="ub-f1 cl-b-white per-info-item">
			<p class="ub ub-ac cl-f-xxlgrey">
				<span class="per-l-long cl-f-black">微博地址</span>
				<input type="text" class="per-input ub-f1" name="uweibo" value="{$info.uweibo}" placeholder="请输入微博地址">
			</p>
			<p class="ub ub-ac cl-f-xxlgrey">
				<span class="per-l-long cl-f-black"> QQ 空间</span>
				<input type="text" class="per-input ub-f1" name="uqqzone" value="{$info.uqqzone}" placeholder="请输入QQ空间地址">
			</p>
			<p class="ub cl-f-xxlgrey">
				<span class="per-l-long cl-f-black">个人简介</span>
				<textarea name="usign"  style="height: 100px"  placeholder="请输入个人简介" class="per-input ub-f1">{$info.usign}</textarea>
			</p>
		</div>
	</form>
	<script src="__JS__/jquery-1.11.1.min.js?t={$ver}"></script>
	<script src="__JS__/jquery.lazyload.min.js?t={$ver}"></script>
	<script src="__JS__/post.js?t={$ver}"></script>
	<script src="__JS__/common.js?t={$ver}"></script>
	<script>
	//省市三级联动
	function loadRegion(sel,selName,url){
	    jQuery("#"+selName+" option").each(function(){
	        jQuery(this).remove();
	    });
	    jQuery("<option value=0>请选择</option>").appendTo(jQuery("#"+selName));
	    if(jQuery("#"+sel).val()==0){
	        return;
	    }
	    jQuery.getJSON(url,{pid:jQuery("#"+sel).val()},
	        function(data){
	            if(data){
	                jQuery.each(data,function(idx,item){
	                    jQuery("<option value="+item.id+">"+item.name+"</option>").appendTo(jQuery("#"+selName));
	                });
	            }else{
	                jQuery("<option value='0'>请选择</option>").appendTo(jQuery("#"+selName));
	            }
	        }
	    );
	}

	$(function(){
	    $('.user-sendbtn').click(function(e){
	        e.preventDefault();
	        var _this = $(this);
	        var type = _this.attr('data-type');
	        if(type == 'yes')
	        {
	        	var url = $('.user-form').attr('data-url');
	    		if(url == undefined || url == '')
	    		{
	    			showToast('配置错误');
	    			return false;
	    		}
	            var data = getPostData('user-form');
	            _this.attr('data-type', 'no');
	            $.ajax({
	                url: url,
	                type: 'POST',
	                dataType: 'json',
	                data: data,
	                success: function(res){
	                    showToast(res.info);
	                    _this.attr('data-type', 'yes');
	                },
	                error: function(res){
	                    showToast('系统繁忙');
	                    _this.attr('data-type', 'yes');
	                } 
	            });
	        }
	        else
	        {
	            showToast('数据提交中');
	        }
	    });
	});
	</script>
</body>
</html>
